<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ page import="com.cmq.web_1.api_test.Student" %>
<%@ page import="com.cmq.web_1.api_test.StudentService" %>
<%@ page import="java.util.List" %>
<%
  // 获取上下文路径
  String contextPath = request.getContextPath();

  // 获取学生服务实例
  StudentService studentService = new StudentService();

  // 获取所有学生
  List<Student> students = studentService.getAllStudents();

  // 获取查询参数
  String searchId = request.getParameter("id");
  String searchName = request.getParameter("name");
  String searchClass = request.getParameter("className");
  String searchMajor = request.getParameter("major");

  // 如果有查询参数，则进行筛选
  if (searchId != null || searchName != null || searchClass != null || searchMajor != null) {
    java.util.Map<String, String> conditions = new java.util.HashMap<>();
    if (searchId != null && !searchId.trim().isEmpty()) conditions.put("id", searchId);
    if (searchName != null && !searchName.trim().isEmpty()) conditions.put("name", searchName);
    if (searchClass != null && !searchClass.trim().isEmpty()) conditions.put("className", searchClass);
    if (searchMajor != null && !searchMajor.trim().isEmpty()) conditions.put("major", searchMajor);

    students = studentService.searchStudents(conditions);
  }
%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>学生信息列表</title>
  <style>
    * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }

    body {
      font-family: 'Microsoft YaHei', Arial, sans-serif;
      background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
      min-height: 100vh;
      padding: 20px;
    }

    .container {
      max-width: 1200px;
      margin: 0 auto;
      background: white;
      border-radius: 15px;
      box-shadow: 0 10px 30px rgba(0,0,0,0.2);
      overflow: hidden;
    }

    .header {
      background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
      color: white;
      padding: 25px;
      text-align: center;
    }

    .header h1 {
      font-size: 2.2em;
      margin-bottom: 10px;
    }

    .content {
      padding: 30px;
    }

    .search-panel {
      background: #f8f9fa;
      padding: 20px;
      border-radius: 10px;
      margin-bottom: 25px;
      border: 2px solid #e9ecef;
    }

    .search-panel h3 {
      color: #495057;
      margin-bottom: 15px;
    }

    .search-form {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
      gap: 15px;
      align-items: end;
    }

    .form-group {
      margin-bottom: 0;
    }

    .form-group label {
      display: block;
      margin-bottom: 5px;
      font-weight: bold;
      color: #495057;
    }

    .form-group input, .form-group select {
      width: 100%;
      padding: 10px;
      border: 2px solid #e9ecef;
      border-radius: 5px;
      font-size: 14px;
    }

    .btn {
      padding: 10px 20px;
      border: none;
      border-radius: 5px;
      font-size: 14px;
      font-weight: bold;
      cursor: pointer;
      transition: all 0.3s ease;
    }

    .btn-primary {
      background: #007bff;
      color: white;
    }

    .btn-primary:hover {
      background: #0056b3;
    }

    .btn-secondary {
      background: #6c757d;
      color: white;
    }

    .btn-secondary:hover {
      background: #5a6268;
    }

    .student-table {
      width: 100%;
      border-collapse: collapse;
      margin: 20px 0;
      box-shadow: 0 2px 10px rgba(0,0,0,0.1);
      border-radius: 8px;
      overflow: hidden;
    }

    .student-table th, .student-table td {
      padding: 15px;
      text-align: left;
      border-bottom: 1px solid #e0e0e0;
    }

    .student-table th {
      background: #f8f9fa;
      font-weight: bold;
      color: #495057;
    }

    .student-table tr:hover {
      background: #f8f9ff;
    }

    .empty-state {
      text-align: center;
      padding: 50px;
      color: #6c757d;
    }

    .empty-state i {
      font-size: 3em;
      margin-bottom: 20px;
    }

    .nav-links {
      text-align: center;
      margin-top: 30px;
    }

    .nav-link {
      display: inline-block;
      margin: 0 10px;
      padding: 12px 25px;
      background: #6c757d;
      color: white;
      text-decoration: none;
      border-radius: 25px;
      transition: background 0.3s ease;
    }

    .nav-link:hover {
      background: #5a6268;
    }

    .nav-link.primary {
      background: #007bff;
    }

    .nav-link.primary:hover {
      background: #0056b3;
    }

    .summary {
      text-align: center;
      margin: 15px 0;
      color: #495057;
      font-weight: bold;
    }

    @media (max-width: 768px) {
      .student-table {
        display: block;
        overflow-x: auto;
      }

      .search-form {
        grid-template-columns: 1fr;
      }
    }
  </style>
</head>
<body>
<div class="container">
  <div class="header">
    <h1>📊 学生信息列表</h1>
    <p>查看和管理所有学生信息</p>
  </div>

  <div class="content">
    <div class="search-panel">
      <h3>🔍 学生信息查询</h3>
      <form class="search-form" method="get" action="<%= contextPath %>/api_test/student-list.jsp">
        <div class="form-group">
          <label>学号:</label>
          <input type="text" name="id" value="<%= searchId != null ? searchId : "" %>" placeholder="输入学号">
        </div>
        <div class="form-group">
          <label>姓名:</label>
          <input type="text" name="name" value="<%= searchName != null ? searchName : "" %>" placeholder="输入姓名">
        </div>
        <div class="form-group">
          <label>班级:</label>
          <input type="text" name="className" value="<%= searchClass != null ? searchClass : "" %>" placeholder="输入班级">
        </div>
        <div class="form-group">
          <label>专业:</label>
          <input type="text" name="major" value="<%= searchMajor != null ? searchMajor : "" %>" placeholder="输入专业">
        </div>
        <div class="form-group">
          <button type="submit" class="btn btn-primary">搜索</button>
          <a href="<%= contextPath %>/api_test/student-list.jsp" class="btn btn-secondary">重置</a>
        </div>
      </form>
    </div>

    <div class="summary">
      共找到 <%= students.size() %> 名学生
    </div>

    <% if (students.isEmpty()) { %>
    <div class="empty-state">
      <div>📭</div>
      <h3>暂无学生数据</h3>
      <p>没有找到符合条件的学生信息</p>
    </div>
    <% } else { %>
    <table class="student-table">
      <thead>
      <tr>
        <th>学号</th>
        <th>姓名</th>
        <th>年龄</th>
        <th>性别</th>
        <th>班级</th>
        <th>专业</th>
        <th>邮箱</th>
      </tr>
      </thead>
      <tbody>
      <% for (Student student : students) { %>
      <tr>
        <td><%= student.getId() %></td>
        <td><%= student.getName() %></td>
        <td><%= student.getAge() %></td>
        <td><%= student.getGender() %></td>
        <td><%= student.getClassName() %></td>
        <td><%= student.getMajor() %></td>
        <td><%= student.getEmail() %></td>
      </tr>
      <% } %>
      </tbody>
    </table>
    <% } %>

    <div class="nav-links">
      <a href="<%= contextPath %>/api_test/api-test.jsp" class="nav-link primary">🧪 API测试页面</a>
      <a href="<%= contextPath %>/api_test/index-api.jsp" class="nav-link">🏠 返回首页</a>
    </div>
  </div>
</div>
</body>
</html>